import useToggle from "./hooks/useToggle";
import useChannels from "./hooks/useChannels";
import {useEffect} from "react";
import useMousemove from "./hooks/useMousemove";

const App = () => {
    const [toggle, setToggle] = useToggle()

    const [channels] = useChannels()

    const {x, y} = useMousemove()

    const handleClick = () => {
        setToggle(!toggle)
    }


    return (
        <div className="App">
            <button onClick={handleClick}>点击{toggle.toString()}</button>
            {
                toggle && <ul>{channels.map((channel, i) => (<li key={i}>{channel.name}</li>))}</ul>
            }
            <h1>x坐标{x}，y坐标{y}</h1>
        </div>
    )
}
export default App;
